<template>
  <div 
    class="scroll"
    :style="{
      paddingLeft: scrollControl.pagePadding + 'px',
    }"
  >
    <el-scrollbar> 
      <div class="scroll-wrap">
        <img 
          :src="item.file" 
          alt="" 
          v-for="(item,index) in bannerList" 
          :key="index"
          :style="{
            marginRight: scrollControl.imgPadding + 'px',
            borderRadius: scrollControl.imageBorder == 0 ? '0' : '6px'
          }"
        >
      </div>

    </el-scrollbar>
  </div>
</template>

<script>
export default {
  name: 'BannerSwiper',
  props:['bannerList','scrollControl'],
  data() {
    return {
    
    }
  },
  computed: {
    
  },
  mounted() {
    console.log(this.bannerList, 'bannerList')
    console.log('Current Swiper instance object', this.swiper)
  },
  methods: {

  },
}
</script>

<style lang="less" scoped>
  .el-scrollbar {
    width: 100%;
    .scroll-wrap {
      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      img {
        width: 280px;
        height: 131px;
      }
    }
   
  }
</style>